<template>
  <div><h2>课程管理</h2>
  <!-- <el-row :gutter="20"> -->
  <el-dropdown>
    <span class="el-dropdown-link">
      Dropdown List
      <el-icon class="el-icon--right">
        <arrow-down />
      </el-icon>
    </span>
    <template #dropdown>
      <el-dropdown-menu>
        <el-dropdown-item>Action 1</el-dropdown-item>
        <el-dropdown-item>Action 2</el-dropdown-item>
        <el-dropdown-item>Action 3</el-dropdown-item>
        <el-dropdown-item disabled>Action 4</el-dropdown-item>
        <el-dropdown-item divided>Action 5</el-dropdown-item>
      </el-dropdown-menu>
    </template>
  </el-dropdown>
  <el-input v-model="input" placeholder="" />
    <el-button type="primary">Primary</el-button>
     <!-- </el-row> -->
  </div>
</template>

<script>
// import {
//   ElButton,
//   ElInput,
//   ElDropdown,
//   ElIcon,
//   ArrowDown,
//   ElDropdownMenu,
//   ElDropdownItem
// } from "element-plus";
// import { ArrowDown } from "@element-plus/icons-vue";';''
// import { ElButton } from "element-plus";
// import {
//   Search,
//   Edit,
//   Check,
//   Message,
//   Star,
//   Delete
// } from "@element-plus/icons-vue";
// import { ref } from "vue";
// const input = ref("");
export default {
  setup() {},
  components: {
    // "el-button": ElButton,
    // "el-input": ElInput,
    // "el-dropdown": ElDropdown,
    // "el-icon": ElIcon,
    // "arrow-down": ArrowDown,
    // "el-dropdown-menu": ElDropdownMenu,
    // "el-dropdown-item": ElDropdownItem
  }
};
</script>

<style lang="less" scoped>
.example-showcase .el-dropdown-link {
  cursor: pointer;
  color: var(--el-color-primary);
  display: flex;
  align-items: center;
}
h2 {
  margin-top: 18px;
  margin-left: 19px;
  margin-bottom: 40px;
  font-size: 18px;
}
</style>
